<template>

	<view class="container" :style="{height:minHeight+'px'}">
		<view class="banner">
			<swiper :indicator-dots="true"  :autoplay="true" indicator-active-color="#fff"
						:interval="3000" :duration="1000" circular>
				<swiper-item v-for="(item,index) in banners" :key="index">
					<image :src="item.image" mode=""></image>
				</swiper-item>
			</swiper>
		</view>
		
		<view class="content">
			<view class="grid">
				<view class="grid-item" v-for="(item,index) in gridList" :key="index" @click="changePage(item)">
					{{item.text }}
				</view>
			</view>
			<view class="classify">
				<view class="classify-item" v-for="(item,index) in classifyList" :key="index" @click="toHomeWear(item)">
					<view class="image">
						<image :src="item.url" mode="aspectFill"></image>
					</view>
					<text>{{item.txt}}</text>
				</view>
			</view>
		</view>
		<div class="campany-content">
			<view class="title">
				<uni-icons custom-prefix="iconfont" type="company" size="20"></uni-icons>
				<text>湖南征信认证家服公司</text>
			</view>
			<CompanyList :list='companyList' @click='toCamponyDetail'/>
			<view class="more">
				更多公司 >
			</view>
		</div>
		<div class="housekeeper-content">
			<view class="title">
				<uni-icons custom-prefix="iconfont" type="women" size="20"></uni-icons>
				<text>诚信注册家服员</text>
			</view>
			<HousekeeperList :list='housekeeperList' @click='toMatenity'/>
			<view class="more">
				更多公司 >
			</view>
		</div>

	</view>
</template>

<script>
	import CompanyList from '@/components/company-list/company-list.vue'
	import HousekeeperList from '@/components/housekeeperList/housekeeperList.vue'
	export default {
		components:{
			CompanyList,
			HousekeeperList
		},
		data() {
			return {
				banners:[],
				gridList:[{
					text:'入驻商务部',
					navigator:'/subpkg/strengthe/strengthe'
				},{
					text:'家政求职',
					navigator:'/subpkg/bidding/bidding'
				},{
					text:'找家政商务',
					navigator:'/subpkg/house-laon/house-laon'
				},{
					text:'线上家政培训',
					navigator:'/subpkg/service-standard/service-standard'
				},{
					text:'线上家政保险',
					navigator:'/subpkg/service-standard/service-standard'
				},{
					text:'合同',
					navigator:'/subpkg/service-standard/service-standard'
				}],
				classifyList:[{
					txt:'月嫂',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fepaper.zzxw.net%2Fresfile%2F2021-10-12%2F03%2Fzz1012003_002_01_b.jpg&refer=http%3A%2F%2Fepaper.zzxw.net&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669040615&t=bb3b9926b0929cc15ccf274f60f36cc8'
				},{
					txt:'育婴师',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg2.3png.com%2F411e3ed0541f1d350cde4561b6de75aa7218.png&refer=http%3A%2F%2Fimg2.3png.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669040697&t=57aeb85ed09b23c4bc39f4fc2f974ef4'
				},{
					txt:'保洁/清洁',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpub-point.hizh.cn%2Fimages%2F202006%2F01%2F5ed47443e4b056c584b35dea.jpeg&refer=http%3A%2F%2Fpub-point.hizh.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669040718&t=a13a348182d9e2123c1959eb89cb7834'
				},{
					txt:'保姆',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic.616pic.com%2Fys_bnew_img%2F00%2F38%2F25%2FgxYKFOll9t.jpg&refer=http%3A%2F%2Fpic.616pic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669040750&t=5b93fb8189de473d1e284265ff45ddcf'
				},{
					txt:'产康师',
					url:'https://img2.baidu.com/it/u=3666035454,4264823834&fm=253&fmt=auto&app=120&f=JPEG?w=677&h=441'
				},{
					txt:'早教/托育',
					url:'https://img2.baidu.com/it/u=799833716,1439611642&fm=253&fmt=auto&app=138&f=JPEG?w=379&h=403'
				},{
					txt:'养老/陪护',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Ftyunfile.71360.com%2FUploadFile%2Faimeinuo%2F637209037532382812%2F6732942.jpg&refer=http%3A%2F%2Ftyunfile.71360.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669041056&t=e12d0cee162146ab6ea4ac1516ae3837'
				},{
					txt:'家装/搬家',
					url:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimagepphcloud.thepaper.cn%2Fpph%2Fimage%2F87%2F224%2F973.jpg&refer=http%3A%2F%2Fimagepphcloud.thepaper.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1669040825&t=4df8110cde7ff54ce8502dcd6d1b7fcb'
				}],
				companyList:[
					{
						id:1,
						name:'湖南金管家家政服务有限公司',
						text:'您的笑容（满意），我们的追求',
						status:['协会成员','服务号','环境优美'],
						distance:'20.5km',
						address:'湖南省长沙市天心去暮云工业园开服曼程住宅长沙市天心去暮云工业园开服曼程住宅',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimages.3158.cn%2Fdata%2Fattachment%2Ftougao%2Farticle%2F2018%2F05%2F25%2F0e2804ac21b4519ea6880d09acc16811.jpg&refer=http%3A%2F%2Fimages.3158.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668394924&t=e33d929f557b297c1b1bfa7208755688'
					},
					{
						id:1,
						name:'湖南金管家家政服务有限公司',
						text:'您的笑容（满意），我们的追求',
						status:['协会成员','服务号','环境优美'],
						distance:'20.5km',
						address:'湖南省长沙市天心去暮云工业园开服曼程住宅',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fweb.51ejz-yspx.com%2Fuploads%2Fallimg%2F180917%2F1-1P91G540210-L.gif&refer=http%3A%2F%2Fweb.51ejz-yspx.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668394956&t=c590a4f81b8307a3073b5dfb1443cc64'
					},
					{
						id:1,
						name:'湖南金管家家政服务有限公司',
						text:'您的笑容（满意），我们的追求',
						status:['协会成员','服务号','环境优美'],
						distance:'20.5km',
						address:'湖南省长沙市天心去暮云工业园开服曼程住宅',
						image:'https://img2.baidu.com/it/u=1607360708,926391550&fm=253&fmt=auto&app=138&f=PNG?w=504&h=371'
					}
				],
				housekeeperList:[
					{
						id:1,
						name:'张丽丽',
						price:'8000元/26天',
						status:['二星育婴师','6年经验'],
						text:'湖南长沙 | 41岁 | 服务13户 | 评价13条',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2F70897d99-67d9-7d59-b780-c37b04dc4ac1%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668411913&t=32e95ac54897e295befe35044327e42d'
					},
					{
						id:1,
						name:'张丽丽',
						price:'8000元/26天',
						status:['二星育婴师','6年经验'],
						text:'湖南长沙 | 41岁 | 服务13户 | 评价13条',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fepaper.zzxw.net%2Fresfile%2F2021-10-12%2F03%2Fzz1012003_002_01_b.jpg&refer=http%3A%2F%2Fepaper.zzxw.net&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668411944&t=d49db42d4f1a1e0bbd1dab7912b721cd'
					},
					{
						id:1,
						name:'张丽丽',
						price:'8000元/26天',
						status:['二星育婴师','6年经验'],
						text:'湖南长沙 | 41岁 | 服务13户 | 评价13条',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg1.gtimg.com%2Fnews%2Fpics%2Fhv1%2F134%2F154%2F2225%2F144720029.png&refer=http%3A%2F%2Fimg1.gtimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668411964&t=a523765bbe6fb74f2c1cb5e654c10139'
					},
					{
						id:1,
						name:'张丽丽',
						price:'8000元/26天',
						status:['二星育婴师','6年经验'],
						text:'湖南长沙 | 41岁 | 服务13户 | 评价13条',
						image:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp9.itc.cn%2Fimages01%2F20211004%2F80a1fadcb4d3415f91318ba937761fbd.png&refer=http%3A%2F%2Fp9.itc.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1668411982&t=f679a24ed16f6bddb846f4141762c18b'
					}
				],
			}
		},
		created() {
			uni.request({
				url:'https://applet-base-api-t.itheima.net/slides',
				timeout:3000,
				success:(res)=> {
					this.banners=res.data
				},
				fail: (err) => {
					console.log('请求错误');
				}
			})
		},
		methods: {
			changePage(item){
				wx.navigateTo({
					url:item.navigator
				})
			},
			toCamponyDetail(item){
				wx.navigateTo({
					url:'/subpkg/domestic-company/domestic-company?company='
				})
			},
			toMatenity(item){
				wx.navigateTo({
					url:'/subpkg/maternity/maternity?women='
				})
			},
			toHomeWear(item){
				wx.switchTab({
					url:'/pages/homeWear/homeWear?name='+item
				})
			}

		}
	}
</script>


<style lang='scss'>
	.container {
		font-size: 28rpx;
		.banner{
			width: 100%;
			height: auto;
			background-color: #3F51B5;
			overflow: hidden;
			swiper{
				margin: 0 30rpx 30rpx 30rpx;
			}
			image{
				width: 100%;
				height: 100%;
			}
		}
		.content{
			padding: 30rpx;
			background-color: #fff;
			margin-bottom: 20rpx;
			.grid{
				font-size: 24rpx;
				display: grid;
				grid-template-columns: repeat(3,218rpx);
				grid-template-rows: repeat(2,174rpx);
				grid-gap: 18rpx;
				justify-items: center;
				align-items: center;
				
				.grid-item{
					background-color: #EEECEC ;
					height: 100%;
					width: 100%;
					border-radius: 12rpx;
					text-align: center;
					line-height: 174rpx;
				}
			}
			
			.classify{
				display: grid;
				grid-template-columns: repeat(4,170rpx);
				grid-template-rows: repeat(2,190rpx);
				.classify-item{
					width: 100%;
					height: 100%;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					align-items: center;
					view{
						width: 110rpx;
						height: 110rpx;
						background-color: #EEECEC ;
						border-radius: 50%;
						margin: 26rpx 0 24rpx 0;
					}
					image{
						width: 100%;
						height: 100%;
					}
				}
			}
		}
		.campany-content,.housekeeper-content{
			background-color: #fff;
			margin-bottom: 20rpx;
			.title{
				line-height: 90rpx;
				padding-left: 40rpx;
			}
			.uni-icons{
				margin-right: 20rpx;
			}
			.more{
				line-height:80rpx ;
				text-align: center;
				font-size: 24rpx;
				color: #666;
			}
		}
	}
</style>
